<script setup>
import { storeToRefs } from 'pinia'
import { computed } from 'vue'
import Logged from '@/components/me/Logged.vue'
import Login from '@/components/me/Login.vue'
import NavBar from '@/components/NavBar.vue'
import { useUserStore } from '@/stores/user'

const { isLogin } = storeToRefs(useUserStore())
const currentTitle = computed(() => isLogin ? '我的' : '完善基本信息')
</script>

<template>
  <view class="container relative pb-safe min-h-safe">
    <NavBar :title="currentTitle" :show-left-icon="false" />
    <img class="absolute h-full w-full left-0 top-0 z-1" src="@/static/image/me/bg.jpg" alt="">
    <!-- 未登录 -->
    <Login v-if="!isLogin" class="absolute w-full z-10" />
    <!-- 已登录 -->
    <Logged v-else class="absolute w-full z-10" />
  </view>
</template>

<style scoped>
.container {
  background-color: #f5f5f5;
}
</style>
